.bigbox {
    width: 100%;
    height: 100%;
    background-image: url("../../../assets/home/bgheader.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
	overflow: hidden;
}
.textheader {
    font-size: 0.32rem;
    color: #fff;
    width: 100%;
    text-align: center;
    font-weight: bold;
    letter-spacing: 0.1rem;
}
.tjbox {
    margin-top: 5vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.6rem;
    font-size: 0.28rem;
    .tjitem {
        width: 2.3rem;
        height: 1.8rem;
        background-image: url("../../../assets/home/tjkj.png");
        background-size: 100% 100%;
        background-repeat: no-repeat;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        color: #fff;
        padding-top: 0.12rem;
        padding-bottom: 0.5rem;
        .tjitem_num {
            font-weight: bold;
        }
    }
}
.contbox {
    width: 100%;
    padding: 0 0.5rem;
    margin-top: 2vh;
    .contheader {
        width: 100%;
        background-image: url("../../../assets/home/btbg.png");
        background-size: 100% 100%;
        background-repeat: no-repeat;
        font-size: 0.24rem;
        color: #fff;
        padding: 0.07rem 0.2rem;
        padding-top: 0;
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
    }
    .righthd {
        padding-right: 0.2rem;
        display: flex;
        align-items: center;
    }
    .tipsbox {
        display: flex;
        align-items: center;
        font-size: 0.18rem;
    }
    .yuan {
        width: 0.1rem;
        height: 0.1rem;
        border-radius: 100%;
        background-color: #00fc65;
        margin-right: 0.05rem;
    }
}
.continner {
    width: 69%;
    height: 93%;
    padding: 1%;
    display: flex;
    align-items: center;
    .shubox {
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-left: 1.2rem;
        position: relative;
    }
    .shubox:nth-child(1) {
        margin-left: 1rem;
    }
    .contitem {
        width: 1.4rem;
        height: 1.4rem;
        background-image: url("../../../assets/home/zaix.png");
        background-size: 100% 100%;
        background-repeat: no-repeat;
        position: relative;
        margin-top: 2vh;
        cursor: pointer;
    }
    .lixbox{
        background-image: url("../../../assets/home/lix.png");
    }
    .contitem:nth-child(1) {
        margin-top: 0;
    }
    .infobox{
        position: absolute;
        width:3rem;
        padding: 0.2rem;
        border-radius: 0.1rem;
        border: 1px solid #409eff;
		box-shadow: inset 0px 0px 10px 2px #409eff;
		background-color: rgb(0, 0, 0);
        top: -150%;
        left:-50%;
        z-index: 5;
        display:none;
        .infobox_item{
            display: flex;
            align-items: center;
            justify-content: space-between;
            width: 100%;
            color: #fff;
            font-size: 0.14rem;
            margin-bottom: 10px;
        }
        .infobox_item:nth-last-child(1){
            margin-bottom: 0;
        }
        .infobox_item_text{
            color: #409eff;
        }
    }
    .contitem:hover .infobox{
        display:block;
    }
    .status {
        display: flex;
        align-items: center;
        position: absolute;
        top: 5%;
        left: 7%;
    }
    .namebox {
        position: absolute;
        bottom: 5%;
        left: 0;
        right: 0;
        margin: auto;
        font-size: 0.14rem;
        width: 80%;
        color: #fff;
        text-align: center;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }
}
.threebox {
    position: absolute;
    width: 0.6rem;
    height: 3rem;
    border-top: 2px solid rgb(0, 149, 255);
    border-left: 2px solid rgb(0, 149, 255);
    border-bottom: 2px solid rgb(0, 149, 255);
    left: -0.6rem;
    top: 0.8rem;
}
.threebox::before {
    content: "";
    position: absolute;
    width: 0.6rem;
    height: 2px;
    background-color: #409eff;
    top: 0;
    bottom: 0;
    margin: auto;
}
.threebox::after {
    content: "";
    position: absolute;
    width: 6px; /* 小点的大小 */
    height: 6px;
    background-color: rgb(255, 255, 255); /* 小点的颜色 */
    border-radius: 50%; /* 圆形小点 */
    animation: border-trace 6s linear infinite; /* 应用动画 */
}
.midyq{
    position: absolute;
    width: 6px; /* 小点的大小 */
    height: 6px;
    background-color: rgb(255, 255, 255); /* 小点的颜色 */
    border-radius: 50%; /* 圆形小点 */
    top: 0;
    bottom: 0;
    margin: auto;
    animation: border-trace22 6s linear infinite; /* 应用动画 */
    animation-delay: 0.5s;
}
@keyframes border-trace22 {
    0% {
        right:100%;
    }
    50%{
        right: 50%; 
     }
    50%{
       right: 0%; 
       opacity: 0;
    }
    100% {
        right: 0;
        opacity: 0;
    }
}



.twobox {
    position: absolute;
    width: 0.6rem;
    height: 1.8rem;
    border-top: 2px solid rgb(0, 149, 255);
    border-left: 2px solid rgb(0, 149, 255);
    border-bottom: 2px solid rgb(0, 149, 255);
    left: -0.6rem;
    top: 0.5rem;
}
.twobox::before {
    content: "";
    position: absolute;
    width: 6px; /* 小点的大小 */
    height: 6px;
    background-color: rgb(255, 255, 255); /* 小点的颜色 */
    border-radius: 50%; /* 圆形小点 */
    animation: border-trace 6s linear infinite; /* 应用动画 */
}
.oneitem {
    position: absolute;
    width: 0.5rem;
    height: 0.8rem;
    border-top: 2px solid rgb(0, 149, 255);
    border-left: 2px solid rgb(0, 149, 255);
    border-bottom: 2px solid rgb(0, 149, 255);
    left: -0.5rem;
    top: 0;
    bottom: 0;
    margin: auto;
}

.oneitem::before {
    content: "";
    position: absolute;
    width: 6px; /* 小点的大小 */
    height: 6px;
    background-color: rgb(255, 255, 255); /* 小点的颜色 */
    border-radius: 50%; /* 圆形小点 */
    animation: border-trace 4s linear infinite; /* 应用动画 */
}

@keyframes border-trace {
    0% {
        top: 0;
        left: 0;
        transform: translate(-100%, -50%);
    }
    25% {
        top: 100%;
        left: 0;
        transform: translate(-100%, -50%);
    }
    50% {
        top: 100%;
        left: 100%;
        transform: translate(-50%, -50%);
        opacity: 0;
    }
    75% {
        top: 0;
        left: 100%;
        transform: translate(-50%, -50%);
        opacity: 0;
    }
    100% {
        top: 0;
        left: 0;
        transform: translate(-100%, -50%);
    }
}
.contbody {
    height: 57vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
:deep(.el-select__wrapper) {
    background: linear-gradient(to right, rgb(62, 130, 233), rgb(18, 31, 49));
    box-shadow: 0 0 0 1px rgb(62, 130, 233) inset;
}
:deep(.el-select__placeholder) {
    color: #fff;
}
:deep(.el-pagination.is-background .el-pager li) {
    background-color: rgb(16, 26, 41);
    border: 1px solid rgb(85, 102, 123);
    color: #fff;
}
:deep(.el-pagination.is-background .btn-prev) {
    background-color: rgb(16, 26, 41);
    border: 1px solid rgb(85, 102, 123);
    color: #fff;
}
:deep(.el-pagination.is-background .btn-next) {
    background-color: rgb(16, 26, 41);
    border: 1px solid rgb(85, 102, 123);
    color: #fff;
}
:deep(.el-pagination.is-background .el-pager li.is-active) {
    background-color: #409eff;
}
:deep(.el-dialog__header){
    display: flex;
}